{% extends "layout.html" %}
{% block body %}
<div class="well col-sm-6 col-sm-offset-2">
  <h2 style="margin-top: 0">{{_('Login')}}</h2>
  <form method="POST" role="form">
    <input type="hidden" name="next" value="{{next_url}}">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    {% if not config.config_disable_standard_login %}
    <div class="form-group">
      <label for="username" style="color: var(--color-primary)">{{_('Username')}}</label>
      <input type="text" class="form-control" id="username" name="username" autocapitalize="off" placeholder="{{_('Username')}}" value="{{ username }}">
    </div>
    <div class="form-group">
      <label for="password" style="color: var(--color-primary)">{{_('Password')}}</label>
      <input type="password" class="form-control" id="password" name="password" placeholder="{{_('Password')}}" value="{{ password }}">
    </div>
    <div style="display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: baseline;">
      <div class="checkbox">
        <label>
          <input type="checkbox" onclick="password.type = this.checked ? 'text' : 'password'"> {{_('Show Password')}}
        </label>
      </div>
      <div class="checkbox">
        <label>
          <input type="checkbox" name="remember_me" checked> {{_('Remember Me')}}
        </label>
      </div>
    </div>
    <button type="submit" name="submit" class="btn btn-default">{{_('Login')}}</button>
    {% if config.config_login_type == 0 and mail%}
    <button type="submit" name="forgot" value="forgot" class="btn btn-default">{{_('Forgot Password?')}}</button>
    {% endif %}
    {% else %}
    <div class="alert alert-info">
      {{_('Standard login is disabled. Please use one of the alternative login methods below.')}}
    </div>
    {% endif %}
    {% if g.current_theme == 1 %}
      {% if g.allow_registration %}
      <a class="btn btn-default" id="register" href="{{url_for('web.register')}}"><span class="glyphicon glyphicon-user"></span> {{_('Register')}}</a>
      {% endif %}
      {% if g.allow_anonymous %}
      <a class="btn btn-default" href="{{url_for('web.index')}}">{{ _('Home') }}</a>
      {% endif %}
    {%endif%}
    {% if config.config_remote_login %}
    <a href="{{url_for('remotelogin.remote_login')}}" id="remote_login" class="pull-right">{{_('Log in with Magic Link')}}</a>
    {% endif %}
    {% if config.config_login_type == 2 %}
      {% if 1 in oauth_check %}
        <a href="{{url_for('oauth.github_login')}}" class="pull-right github" style="display: flex; width: -webkit-fill-available; height: 4rem; padding: 0.6rem; justify-content: center; margin-top: 1.5rem; border-radius: 4rem; gap: 12px; font-size: 15px; text-transform: capitalize; flex-wrap: nowrap;">
          <svg class="octicon octicon-mark-github" viewBox="0 0 16 16" version="1.1" aria-hidden="true">
            <path fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"></path>
          </svg>
          Login with GitHub
        </a>
      {% endif %}
      {% if 2 in oauth_check %}
        <a href="{{url_for('oauth.google_login')}}" class="pull-right google" style="display: flex; width: -webkit-fill-available; height: 4rem; padding: 0.6rem; justify-content: center; margin-top: 1.5rem; border-radius: 4rem; gap: 12px; font-size: 15px; text-transform: capitalize; flex-wrap: nowrap;">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 3 48 49" style="fill:#000000;">
              <g id="surface1"><path style=" fill:#FFC107;" d="M 43.609375 20.082031 L 42 20.082031 L 42 20 L 24 20 L 24 28 L 35.304688 28 C 33.652344 32.65625 29.222656 36 24 36 C 17.371094 36 12 30.628906 12 24 C 12 17.371094 17.371094 12 24 12 C 27.058594 12 29.84375 13.152344 31.960938 15.039063 L 37.617188 9.382813 C 34.046875 6.054688 29.269531 4 24 4 C 12.953125 4 4 12.953125 4 24 C 4 35.046875 12.953125 44 24 44 C 35.046875 44 44 35.046875 44 24 C 44 22.660156 43.863281 21.351563 43.609375 20.082031 Z "></path><path style=" fill:#FF3D00;" d="M 6.304688 14.691406 L 12.878906 19.511719 C 14.65625 15.109375 18.960938 12 24 12 C 27.058594 12 29.84375 13.152344 31.960938 15.039063 L 37.617188 9.382813 C 34.046875 6.054688 29.269531 4 24 4 C 16.316406 4 9.65625 8.335938 6.304688 14.691406 Z "></path><path style=" fill:#4CAF50;" d="M 24 44 C 29.164063 44 33.859375 42.023438 37.410156 38.808594 L 31.21875 33.570313 C 29.210938 35.089844 26.714844 36 24 36 C 18.796875 36 14.382813 32.683594 12.71875 28.054688 L 6.195313 33.078125 C 9.503906 39.554688 16.226563 44 24 44 Z "></path><path style=" fill:#1976D2;" d="M 43.609375 20.082031 L 42 20.082031 L 42 20 L 24 20 L 24 28 L 35.304688 28 C 34.511719 30.238281 33.070313 32.164063 31.214844 33.570313 C 31.21875 33.570313 31.21875 33.570313 31.21875 33.570313 L 37.410156 38.808594 C 36.972656 39.203125 44 34 44 24 C 44 22.660156 43.863281 21.351563 43.609375 20.082031 Z "></path></g>
            </svg>
          Login with Google
        </a>
      {% endif %}
      {% if 3 in oauth_check %}
        <a href="{{url_for('oauth.generic_login')}}" class="pull-right generic" style="display: flex; width: -webkit-fill-available; height: 4rem; padding: 0.6rem; justify-content: center; margin-top: 2rem; border-radius: 8px; gap: 12px; font-size: 15px; text-transform: capitalize; flex-wrap: nowrap;">{% if generic_login_button %}{{ generic_login_button }}{% else %}{{_('Log in with SSO')}}{% endif %}</a>
      {% endif %}
    {% endif %}
  </form>
</div>
  {% if error %}
  <div class="col-sm-6 col-sm-offset-2">
    <div class="alert alert-danger">{{error}}</div>
  </div>
  {% endif %}
{% endblock %}
